<template>
  <div id="page_13">
    <h2 class="app__title--second">6. 项目打包与性能调优</h2>
    <p>
      项目打包很简单，只需调用 <b>build</b> scripts即可
      <pre><code>$ npm run build</code></pre>
      打包完成后，会在项目根目录下生成一个 <b>dist</b> 文件夹，此文件夹下的所有文件即是打包后可发布生产环境的项目
    </p>
    <p>
      有时候我们想知道打包后的文件都有哪些组成，以便后面的调优，这时候我们可以在打包的 <b>build</b>指令后面添加一个参数 <b>--report</b>，
      注意添加位置是在 <b>package.json</b> 中的scripts中的build指令的值中添加，而不是直接在上述的 npm run build 后面添加，请看：
    </p>
    <p class="img__center">
      <img src="../assets/images/report.jpg" alt="">
    </p>
    <p>
      添加后，再执行 <b>npm run build</b> 会在dist文件夹中生成一个report.html的文件，可在浏览器中
      <a href="https://kaiqi.qhcity.cn/lesson/report.html" target="__blank">打开</a>
    </p>
  </div>
</template>

<script>

export default {
  name: "Page13",
  data() {
    return {
      desc: "6. 项目打包与性能调优"
    }
  },
}
</script>

<style scoped>

</style>